<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('新增任务配置')"/>
    <th:block th:include="include :: select2-css"/>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal m" id="form-post-add">

        <div class="form-group">
            <label class="col-sm-3 control-label is-required">connectName：</label>
            <div class="col-sm-8">
                <select class="form-control" name="dbConfigId" id="dbConfigId" required>
                    <option value="">--请选择数据配置--</option>
                    <option th:each="dbList:${dbConfigList}" th:value="${dbList.id}"
                            th:text="${dbList.connectName}"></option>
                </select>
            </div>
        </div>
        <div style="height: 240px;margin: auto;">
            <div style="float:left;width:50%;">
                <div class="form-group">
                    <label class="col-sm-3 control-label is-required">源表：</label>
                    <div class="col-sm-8">
                        <input class="form-control" type="text" name="originTableName" id="originTableName"
                               placeholder="请填写库名和表名(例如:[db].[table])" required>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-3 control-label is-required">源表主键：</label>
                    <div class="col-sm-8">
                        <input class="form-control" type="text" name="originTablePrimary" id="originTablePrimary"
                               required onblur="orgiginTablePrimaryFun()">
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-3 control-label is-required">源表字段：</label>
                    <div class="col-sm-8">
                        <input class="form-control" type="text" name="originTableFields" id="originTableFields"
                               placeholder="请填写字段名,用逗号分隔" onblur="originTableFieldsFun()"
                               required>
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-sm-3 control-label is-required">源表过滤条件：</label>
                    <div class="col-sm-8">
                        <input class="form-control" type="text" name="originTableFilter" id="originTableFilter"
                               onblur="originTableFilterFun()"
                        >
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-sm-3 control-label is-required">源表分组条件：</label>
                    <div class="col-sm-8">
                        <input class="form-control" type="text" name="originTableGroup" id="originTableGroup"
                               onblur="originTableGroupFun()"
                        >
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-sm-3 control-label is-required">定时调度：</label>
                    <div class="col-sm-8">
                        <select class="form-control" name="schduleStatus" id="schduleStatus" required
                                onchange="change()">
                            <option value="1" selected>否</option>
                            <option value="0">是</option>
                        </select>
                    </div>
                </div>

            </div>

            <div style="float:left;width:45%;">
                <div class="form-group">
                    <label class="col-sm-3 control-label is-required">目标表：</label>
                    <div class="col-sm-8">
                        <div class="col-sm-8">
                            <input class="form-control" type="text" name="toTableName" id="toTableName"
                                   placeholder="请填写库名和表名(例如:[db].[table])" required>
                        </div>
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-sm-3 control-label is-required">目标表主键：</label>
                    <div class="col-sm-8">
                        <input class="form-control" type="text" name="toTablePrimary" id="toTablePrimary" required
                               readonly="readonly">
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-3 control-label is-required">目标表字段：</label>
                    <div class="col-sm-8">
                        <input class="form-control" type="text" name="toTableFields" id="toTableFields" required
                               readonly="readonly">
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-sm-3 control-label is-required">目标过滤条件：</label>
                    <div class="col-sm-8">
                        <input class="form-control" type="text" name="toTableFilter" id="toTableFilter"
                               readonly="readonly">
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-sm-3 control-label is-required">目标分组条件：</label>
                    <div class="col-sm-8">
                        <input class="form-control" type="text" name="toTableGroup" id="toTableGroup"
                               readonly="readonly">
                    </div>
                </div>

                <div class="form-group" style="display: none" id="cronDiv">
                    <label class="col-sm-3 control-label is-required">cron：</label>
                    <div class="col-sm-8">
                        <input class="form-control" type="text" name="schduleTime" id="schduleTime">
                    </div>
                </div>
            </div>
        </div>

    </form>
</div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: select2-js"/>
<script type="text/javascript">
    var prefix = ctx + "system/jobconfig";

    function change() {
        var field = $("#schduleStatus").val();
        if (field == 0) {
            $("#cronDiv").css("display", "block");
        } else {
            $("#cronDiv").css("display", "none");
        }
    }

    function orgiginTablePrimaryFun() {
        var txt = $("#originTablePrimary").val();
        console.log("txt:" + txt);
        if (txt != "" && $.trim(txt).length > 0) {
            $("#toTablePrimary").val(txt);
        }
    }

    function originTableFieldsFun() {
        var txt = $("#originTableFields").val();
        console.log("txt:" + txt);
        if (txt != "" && $.trim(txt).length > 0) {
            $("#toTableFields").val(txt);
        }
    }

    function originTableFilterFun() {
        var txt = $("#originTableFilter").val();
        console.log("txt:" + txt);
        if (txt != "" && $.trim(txt).length > 0) {
            $("#toTableFilter").val(txt);
        }
    }

    function originTableGroupFun() {
        var txt = $("#originTableGroup").val();
        console.log("txt:" + txt);
        if (txt != "" && $.trim(txt).length > 0) {
            $("#toTableGroup").val(txt);
        }
    }

    function submitHandler() {
        if ($.validate.form()) {
            checkTableName(prefix + "/checkTableName", $('#form-post-add').serialize());
        }
    }


    function checkTableName(url, data, callback) {
        var config = {
            url: url,
            type: "post",
            dataType: "json",
            data: data,
            beforeSend: function () {
                $.modal.loading("正在处理中，请稍候...");
            },
            success: function (result) {
                if (typeof callback == "function") {
                    callback(result);
                }
                if (result.code == web_status.SUCCESS) {
                    //$.modal.alertSuccess(result.msg)
                    $.operate.save(prefix + "/add", $('#form-post-add').serialize());
                } else if (result.code == web_status.WARNING) {
                    $.modal.alertWarning(result.msg)
                } else {
                    $.modal.alertError(result.msg);
                }
                $.modal.closeLoading();
            }
        };
        $.ajax(config)
    }

</script>

</body>
</html>
